<template>
  <div v-title data-title="会员中心">
      <main>
          <div class="title">
              <span>乐VIP</span>
              <span class="time">{{user.isVip?reTime(user.vipExpired)+'到期':'立即加入会员'}}</span>
          </div>
          <div class="pay-list">
              <div class="pay-item" @click="pay(3)"></div>
              <div class="pay-item" @click="pay(2)"></div>
              <div class="pay-item" @click="pay(1)"></div>
          </div>
          
      </main>
  </div>
</template>

<script>
export default {
  name: "Member",
  methods: {
    pay(num) {
      let self = this;
      self.yl.get({
        url: "/mp/payment_api/wxpay.json",
        data: { buytype: num },
        success: function(res) {
          if (res.result == "success") {
            console.log(res);
            WeixinJSBridge.invoke(
              "getBrandWCPayRequest",
              {
                appId: res.data.signPackage.appId, //公众号名称，由商户传入
                timeStamp: res.data.signPackage.timeStamp, //时间戳自1970年以来的秒数
                nonceStr: res.data.signPackage.nonceStr, //随机串
                package: res.data.signPackage.packageValue,
                signType: res.data.signPackage.signType,
                paySign: res.data.signPackage.paySign //微信签名
              },
              function(res) {
                if (res.err_msg == "get_brand_wcpay_request:ok") {
                  if(self.yl.GetQueryString('gameid')){
                    window.location.href='https://mp.yile.vip/qrcode.htm?qrcodeid='+self.yl.GetQueryString('qrcodeid')+'&gameId='+self.yl.GetQueryString('gameid');
                  }else{

                  }
                } else {
                }
              }
            );
          } else {

          }
        }
      });
    },
    reTime: function(date) {
      var gmtCreate = new Date(Number(date)),
        y = gmtCreate.getFullYear(),
        m =
          gmtCreate.getMonth() + 1 <= 9
            ? "0" + (gmtCreate.getMonth() + 1)
            : gmtCreate.getMonth() + 1,
        d =
          gmtCreate.getDate() <= 9
            ? "0" + gmtCreate.getDate()
            : gmtCreate.getDate(),
        h =
          gmtCreate.getHours() <= 9
            ? "0" + gmtCreate.getHours()
            : gmtCreate.getHours(),
        mi =
          gmtCreate.getMinutes() <= 9
            ? "0" + gmtCreate.getMinutes()
            : gmtCreate.getMinutes(),
        s =
          gmtCreate.getSeconds() <= 9
            ? "0" + gmtCreate.getSeconds()
            : gmtCreate.getSeconds();
      var date1 = y + "-" + m + "-" + d + " " + h + ":" + mi + ":" + s;
      return date1;
    }
  },
  computed: {
    user() {
      return this.$store.state.user;
    }
  }
};
</script>

<style scoped>
main {
  height: 100vh;
  overflow: hidden;
  position: relative;
  background: #281047;
}

main .title {
  text-align: center;
  font-size: 0.36rem;
  color: #fdfffe;
  padding: 0.88rem 0 0.63rem 0;
}
main .title .time {
  color: #f6ab04;
}
main .pay-item {
  width: 4.95rem;
  height: 2.63rem;
  border-radius: 0.25rem;
  margin: 0 auto 0.3rem;
}
.pay-list .pay-item:nth-child(1) {
  background: url("https://i.yile.vip/b/Y790j9fgab2399243679_JAgMZA.png") 0 0
    no-repeat;
  background-size: 100% 100%;
}
.pay-list .pay-item:nth-child(2) {
  background: url("https://i.yile.vip/b/Y790j9efao2499753334_lcsatJ.png") 0 0
    no-repeat;
  background-size: 100% 100%;
}
.pay-list .pay-item:nth-child(3) {
  background: url("https://i.yile.vip/d/Y790j9c24j1623104613_vzCpSy.png") 0 0
    no-repeat;
  background-size: 100% 100%;
}
</style>
